import { observe } from "./observe/index.js";
import { proxy } from "./utils/index.js";

export function initState(vm) {
  const opts = vm.$options;
  // vue的数据来源 属性， 方法， 数据， 计算属性， watch 
  if (opts.props) {
    initProps(vm);
  }
  if (opts.data) {
    initData(vm);
  }
  if (opts.methods) {
    initMethods(vm);
  }
  if (opts.computed) {
    initComputed(vm);
  }
  if (opts.watch) {
    initWatch(vm);
  }
}

function initProps(vm) { }


function initData(vm) {
  // 数据的初始化工作
  let data = vm.$options.data; // 用户传递的data
  // 检测data是否是函数
  /**
   * if (typeof data === "function") {
   *   console.log(data(), 'function');
   * } else {
   *   console.log(data, 'object');
   * }
  */
  vm._data = data = typeof data === "function" ? data.call(this) : data;
  // 接下来需要数据劫持， 用户改变了数据， 我希望能够得到通知  ==> 进行页面或其他操作
  // MVVM模式， 数据变化可以驱动视图变化
  // 方案： 通过Object.defineProperty() 给属性增加get/set方法

  // 为了让用户更好的使用，可以直接通过vm.xx
  for (let key in data) {
    proxy(vm, "_data", key);
  }
  observe(data);
}
function initMethods(vm) { }
function initComputed(vm) { }
function initWatch(vm) { }